前兩天主要在思考「系統需要有哪些功能」以及「畫面應該怎麼設計」。
今天就來思考:

如果今天真的有一個使用者要使用這個系統，他會怎麼操作？

這時候就需要開始規劃User Flow( 使用者流程）。

User Flow可以簡單理解成：

使用者為了完成一個目標，會依序經過哪些畫面與操作？

這次我的系統是以「醫院預約」為主要情境，因此我先從使用者最常見的「查詢醫師->預約 ->查看預約->取消預約」開始規劃。

一、先從一個完整的預約情境開始

我先假設今天使用者進入系統後，想要找一位醫師進行預約。

整個流程大概是：

首頁->醫師查詢->醫師詳細資訊->立即預約->登入->預約掛號->預約成功->我的預約->預約詳細頁面->取消預約->取消成功

這樣看起來很直覺，但在真正開始畫User Flow之後，我發現有一個問題：

「登入」到底應該放在哪裡？

二、開始思考哪個頁面要先登入？

我的系統中，「查詢醫師」屬於一般瀏覽功能。
也就是說，即使使用者還沒有登入，也可以先看看：

• 有哪些醫師
• 醫師的科別
• 醫師介紹
• 門診時間
• 可預約時段

但「預約掛號」不一樣，因為預約時需要知道：

到底是誰預約了這個時段

因此，預約屬於會員操作。
所以我最後決定：

使用者可以在未登入的狀態下瀏覽醫師，但真正進入預約流程時才要求登入

這樣可以避免一進網站就強迫使用者登入，也能讓使用者先了解醫師資訊，再決定要不要預約。

三、未登入與已登入的流程

因此「立即預約」這個按鈕會產生兩種不同流程。

1. 使用者尚未登入

醫師詳細資訊->立即預約->登入->預約掛號->預約成功

使用者點擊「立即預約」後，系統先確認目前是否已登入。
如果沒有登入，就導向登入頁。
登入成功後，再回到預約流程。

2.使用者已經登入

醫師詳細資訊->立即預約->預約掛號->預約成功

已經登入的使用者就不需要再經過登入頁，可以直接進入預約掛號。

四、把它整理成User Flow

我目前將整個「預約」流程整理成：

這樣就可以把「頁面之間的關係」以及「登入判斷」一起呈現出來。

五、User Flow不只是畫箭頭

在規劃User Flow的過程中，我覺得最重要的不是把所有頁面用箭頭連起來。

而是思考:

使用者現在為什麼會來到這個頁面？

例如:

醫師查詢->醫師詳細資訊

使用者先搜尋醫師，看到搜尋結果後，需要進一步了解醫師資訊。

所以:

醫師查詢->醫師詳細資訊

是合理的流程。

醫師查詢->醫師詳細資訊

使用者確認醫師資訊後，如果覺得符合自己的需求，就可以進一步預約。

所以:

醫師詳細資訊->立即預約

這個按鈕應該要放在比較明顯的位置。

預約成功->我的預約

完成預約後，使用者通常還會想確認:

• 預約哪一天
• 哪個醫師
• 哪個科別
• 幾點看診
• 預約是否成功

因此預約成功後，可以讓使用者進入「我的預約」。

六、取消預約也要規劃流程

除了「如何預約」，也需要思考:

如果使用者臨時不能去，要怎麼取消？

因此我把取消流程也加入User Flow:

這裡其實又出現了一個「判斷」。
使用者按下取消預約後，我不會直接取消，而是先讓使用者確認：

確定要取消這筆預約嗎？

避免使用者不小心點到取消按鈕，就直接把預約刪掉。

七、這次規劃User Flow後，我學到了什麼？

在畫User Flow之前，我原本比較容易從「畫面」的角度思考:

我要做首頁、醫師頁面、預約頁面、我的預約……

但開始畫流程之後，我發現:

有畫面不代表使用者知道怎麼使用。

User Flow讓我開始從使用者的角度思考:

「我現在在哪裡？」
「我下一步要做什麼？」
「如果我還沒登入呢？」
「如果我想取消預約呢？」
「如果我按錯了怎麼辦？」

這些問題其實都會影響最後的UI設計。
所以我覺得User Flow可以當成介面設計與之後開始實作之間的一個橋樑。